import {
	createRouter,
	createWebHistory
} from 'vue-router'
import HomeView from '../views/HomeView.vue'
import ShowData from '@/views/showData.vue';

const routes = [
	{
		path: '/',
		name: 'home',
		component: () => import("../views/login.vue"),

	},
	{
		path:"/service",
		name:"service",
		component: () => import("../views/main.vue"),
		children:[
			{
				path:'/service',
				name:'map',
				component: () => import("../components/qin_huang_dao_map.vue")
			},
			{
				path:'/service/family_establishment',
				name:'house',
				component: () => import("../components/household.vue")
			},
			{
				path:'/service/collectively_establishment',
				name:'collectively',
				component: () => import("../components/collective.vue")

			},
			{
				path:'/service/migration_establishment',
				name:'migration',
				component: () => import("../components/migration.vue")

			},
			{
				path:'/service/householdDeclaration_establishment',
				name:'householdDeclaration',
				component: () => import("../components/householdDeclaration.vue")
			},
			{
				path:'/service/householdlogout_establishment',
				name:'householdlogout',
				component: () => import("../components/householdlogout.vue")
			},
			{
				path:'/service/idcard_business',
				name:'idcard_business',
				component: () => import("@/components/idcard_business.vue")
			},
			{
				path:'/service/important_info_collect',
				name:'important_info_collect',
				component: () => import("@/components/important_info_collect.vue")
			},
			{
				path:'/service/important_info_change',
				name:'important_info_change',
				component: () => import("@/components/important_info_change.vue")
			},
			{
				path:'/service/important_info_delect',
				name:'important_info_delect',
				component: () => import("@/components/important_info_delect.vue")
			},
			{
				path:'/service/flow_collection',
				name:'fCollection',
				component: () => import("../components/fcollection.vue")

			},
			{
				path:'/service/flow_change',
				name:'fChange',
				component: () => import("../components/fchange.vue")

			},
			{
				path:'/service/important_info_audit',
				name:'important_info_audit',
				component: () => import("../components/important_info_audit.vue")

			},
			{
				path:'/service/important_info_approval',
				name:'important_info_approval',
				component: () => import("../components/important_info_approval.vue")
			},
						{
				path:'/service/flow_logout',
				name:'flowlogout',
				component: () => import("../components/flowlogout.vue")

			},
			{
				path:'/service/residence_permit_application',
				name:'residence_permit_application',
				component: () => import("../components/residence_permit_application.vue")

			},
			{
				path:'/service/police_station_management',
				name:'police_station_management',
				component:() => import("../components/police_station_management.vue")
			},
			{
				path: '/service/show-data',
				name: 'showData',
				component: () => import('@/components/showData.vue'),
				props: (route) => ({ area: route.query.area })
			}

		]
	},
	{
		path: '/about',
		name: 'about',
		// route level code-splitting
		// this generates a separate chunk (about.[hash].js) for this route
		// which is lazy-loaded when the route is visited.
		component: () => import( /* webpackChunkName: "about" */ '../views/AboutView.vue')
	}
]

const router = createRouter({
	history: createWebHistory(process.env.BASE_URL),
	routes
})

export default router